<!DOCTYPE html>
<html>
<head>
	<title>QWorld</title>
	<meta charset = "UTF-8"/>
	<meta name="viewpheightort" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
	<link rel="stylesheet" type="text/css" href="css/basic.css">
	<link rel="shortcut icon" type="image/x-icon" href="images/logo.png">

	<script src = "js/lib/three.js"></script>
	<script src = "js/lib/dat.gui.js"></script>
	<script src = "js/lib/OrbitControls.js"></script>
	<script src="js/lib/Tween.js"></script>
	<script src="js/lib/VTKLoader.js"></script>
	<script src="js/lib/OBJLoader.js"></script>
	<script src="js/lib/Group.js"></script>
	<script src="js/lib/MeshStandardMaterial.js"></script>
	<script src="js/lib/TransformControls.js"></script>
	<script src="js/lib/GridHelper.js"></script>
	<script src="js/lib/ThreeBSP.js"></script>
	<script src="js/lib/raphael.js"></script>
	<script src="js/lib/spin.js"></script>
	<script src="js/lib/OBJExporter.js"></script>
	<script src="js/lib/STLExporter.js"></script>

	<!-- <script src="js/lib/Stats.js"></script>-->

	<script src = "js/view/ui.js"></script>
	<script src = "js/view/viewPort.js"></script>
	<script src = "js/view/Outliner.js"></script>
	<script src = "js/view/PropertyPanel.js"></script>
	<script src = "js/view/MaterialPanel.js"></script>
	<script src = "js/view/ModifierViewer.js"></script>
	<script src = "js/view/ModifierSelectorViewer.js"></script>
	<script src = "js/view/MyUI.js"></script>
	<script src = "js/view/aboutMe.js"></script>

	<script src = "js/controller/QbjectSelector.js"></script>
	<script src = "js/controller/BuildController.js"></script>
	<script src = "js/controller/ToolsController.js"></script>
	
	<!-- <script src = "js/controller/GuiController.js"></script> -->
	


	
	<!-- <script src = "js/model/ObjectBuilder.js"></script> -->
	<!-- <script src = "js/model/properties.js"></script> -->
	<script src = "js/model/ObjectsManager.js"></script>
	
	<script src = "js/model/AmbientLightHelper.js"></script>
	<!--<script src = "js/model/SVGMaker.js"></script>  -->
	<script src = "js/model/Modifier.js"></script>

	
	
	

	<!--head里除了写一些需要提前加载的库，大部分时候js不写在这里-->
</head>
<body>
	<div id = "hide_background"></div>
	<div id = "about_me_hide" onclick="hide()"><img src="images/about_me.png" alt="关于我"></div>
	<div id = "menu" class="div">
		<div class="div">
			<a href="file.html" class = "menuLink">文件</a>
				<ul id = "file" class = "menuOption">
					<li><a href="" id = "new_file">新建</a></li>
					<li><a href="">导入<input type = "file" id = "import"></a></li>
					<!-- <hr style="color:" /> -->
					<hr style="border-color:#808080"/>
					<li><a href="" id = "export_stl" onclick="return false;">导出STL</a></li>
					<li><a href="" id = "export_obj" onclick="return false;">导出OBJ</a></li>
				</ul>	
		</div>

		<!-- <div class="div">
			<a href="edit.html" class = "menuLink">编辑</a>
				<ul id = "edit" class = "menuOption">
					<li><a href="">成组</a></li>
					<li><a href="">解组</a></li>
				</ul>
		</div> -->
		<div class="div">
			<a href="render.html" class = "menuLink">输出</a>
				<ul id = "render" class = "menuOption">
					<li><a href="" id = "render_button" onclick="return false;">渲染</a></li>
					<!-- <li><a href="">解组</a></li> -->
				</ul>
		</div>
		<div class="div">
			<a href="help.html" class = "menuLink">帮助</a>
				<ul id = "help" class = "menuOption">
					<li><a href="http://git.oschina.net/quanyue/QWorld" target="new">源代码</a></li>
					<li ><a onclick="show()" >关于我</a></li>
				</ul>	
		</div>
	</div>
	


	<!-- <div class = "clear"></div> -->
	<div id = "main" >
		<div id = "Qtools" class = "Qmain">
			<img id = "move" src="images/move.png" />
			<img id = "rotate" src="images/rotate.png" />
			<img id = "scale"  src="images/scale.png" />
			<img id = "delete"  src="images/delete.png" />
			<img id = "copy"  src="images/copy.png" />
		</div>

		<div id = "canvas-frame" class = "Qmain"></div>

		<div id = "Qpanel" class = "Qmain">
			<hr style="border-color: #272727" />

			<div id="panel_group1">
		       	<input class="active" type="button" name = "input"  value="建模" />
		       	<input  type="button" name = "input" id = "modifier" value="修改器" />
		      	<input type="button" name = "input" value="灯光" />
		      	<input type="button" name = "input" value="导航" /><br/>
		      	<div class = "panel" style="display:block;">
		      		<!--建模  所需要的  按钮-->
		      		<img id = "box" src="images/box.png"/>
		      		<img id = "sphere" src="images/sphere.png" />
		      		<img id = "cylinder" src="images/cylinder.png" />
		      		<img id = "plane" src="images/plane.png" />
				</div>
				<div class = "panel">
					<!-- <input type = 'button' id = "convertToMesh" value = 'dfds'/> -->
					<select id = "modifier_list">
						<option selected="selected">空</option>
						<!-- <option>网格编辑器</option>
						<option>布尔运算</option> -->
					</select>
					<div id = 'modifier_viewer'>
						<div>空</div>
					</div>
		      		<!-- <img id = "convertToMesh" src="images/convertToMesh.png"/>
		      		<img id = "pointLight" src="images/pointLight.png" />
		      		<img id = "directionalLight" src="images/directionalLight.png" />
		      		<img id = "ambientLight" src="images/ambientLight.png" /> -->
		      	</div>
		      	<div class = "panel">
		      		<img id = "spotLight" src="images/spotLight.png"/>
		      		<img id = "pointLight" src="images/pointLight.png" />
		      		<img id = "directionalLight" src="images/directionalLight.png" />
		      		<img id = "ambientLight" src="images/ambientLight.png" />
		      	</div>
		      	<div class = "panel" >
		      		<div id = "outliner">
		      			
		      		</div>
		      		
		      	</div>
		    </div>

		    <div id = "panel_group2">
		    	<hr style="border-color: #272727" />
		      	<input class="active" type="button"  value="属性" />
		      	<input type="button" value="材质" /><br/>


		      	<div style="display:block;" name = "panel_below" class = "panel" id= "propertyPanel">属性
		        </div>

		        
		      	<div class = "panel"  name = "panel_below" id = 'materialPanel'>材质</div>
		    </div>
			
		</div>
	</div>
 <!--  -->
 <script type="x-shader/x-vertex" id="vertexshader">

	attribute float size;
	attribute vec3 customColor;

	varying vec3 vColor;

	void main() {

		vColor = customColor;

		vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );

		gl_PointSize = size * ( 300.0 / -mvPosition.z );

		gl_Position = projectionMatrix * mvPosition;

	}

</script>

<script type="x-shader/x-fragment" id="fragmentshader">

	uniform vec3 color;
	uniform sampler2D texture;

	varying vec3 vColor;

	void main() {

		gl_FragColor = vec4( color * vColor, 1.0 );

		gl_FragColor = gl_FragColor * texture2D( texture, gl_PointCoord );

		if ( gl_FragColor.a < ALPHATEST ) discard;

	}

</script>
 <script src = "js/controller/importController.js"></script>
 <script src = "js/controller/exportController.js"></script>
 <script src = "js/controller/renderController.js"></script>
</body>
</html>
